// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import { Table,Tree ,TableColumn,Pagination} from 'element-ui';
Vue.use(Tree);
Vue.use(Table);
Vue.use(TableColumn);
Vue.use(Pagination);
import pageOne from './pages/pageOne'
import pageTwo from './pages/pageTwo';
import pageThree from './pages/pageThree';
import secScreen from './pages/secScreen';//第二屏
import thrScreen from './pages/thrScreen';  //第三屏 By Von

require('./lib/css/until.scss');
require('./pages/index.css');
const echarts=require('echarts');
const $touch=require('./lib/js/touch-0.2.14.min');
Vue.prototype.$echarts = echarts;
// title
Vue.config.productionTip = false;

/* eslint-disable no-new */
new Vue({
  el: '#app',
  components: { pageOne,pageTwo,pageThree,
    'sec-screen': secScreen,
    'thr-screen':thrScreen
  },
  data(){
    return{
      transitionEnd:true,
      isShow:false,
      offset:0
    }
  },
  mounted(){
    let eleApp=this.$refs.app;
    let _this=this
    $touch.on(eleApp,'swipeleft',function () {
      if(!_this.transitionEnd){
        return false
      }
      if(_this.offset>=200){
        _this.offset=200;
        return false
      }
      _this.transitionEnd=false;
      _this.offset=_this.offset+100;
      eleApp.style.webkitTransform='translate3d(-'+_this.offset+'%,0,0)';
    })
    eleApp.addEventListener('webkitTransitionEnd',function () {
      _this.transitionEnd=true;
    },false)
    $touch.on(eleApp,'swiperight',function () {
      if(!_this.transitionEnd){
        return false
      }
      if(_this.offset<=0){
        _this.offset=0;
        return false
      }
      _this.transitionEnd=false;
      _this.offset=_this.offset-100;
      eleApp.style.webkitTransform='translate3d(-'+_this.offset+'%,0,0)';
    })
  },
  methods:{
    overShow(){
      this.isShow=true;
    },
    outHide(){
      this.isShow=false;
    },
    goToPage(e,type){
      let eleApp=this.$refs.app;
      if(type==1){
        this.offset=0
        this.transitionEnd=false;
        eleApp.style.webkitTransform='translate3d(0,0,0)';
      }else if(type==2){
        this.transitionEnd=false;
        this.offset=100
        eleApp.style.webkitTransform='translate3d(-100%,0,0)';
      }else if(type==3){
        this.transitionEnd=false;
        this.offset=200
        eleApp.style.webkitTransform='translate3d(-200%,0,0)';
      }
    }
  }
})
